<template>
	<view class="package space-between">
		<view>编号</view>
		<hpy-form-select :dataList="codeList" text="code" name="value" @change="consolucode"
			:Text="codeName?codeName:code" :icon="true" />
	</view>
	<view class="package">
		<view class="space-between">
			<view>等级</view>
			<hpy-form-select :dataList="levenList" text="name" name="value" @change="consoluleve"
				:Text="levenName?levenName:level" :icon="true" />
		</view>
		<!-- <view class="center list">
			<view v-for="item in levenList" :key="item.id"
				:style="{color:item.name===level?'#fff':'',background:item.name===level?'#558AF1':''}">{{item.name}}
			</view>
		</view> -->
	</view>
</template>

<script setup lang="ts">
	import { navBack, navTo } from '@/utils/navigator';
	import { errorToast, showLoading, successToast } from '@/utils/prompt';
	import { toPublish } from '@mqtt';
	import { getStaffLevel, getStaffCode } from '@/gql/administrator';
	import { ref } from 'vue';
	const props = defineProps({
		level: { type: String },
		code: { type: String },
		id: { type: Number },
	});
	const codeList = ref([])//编号列表
	const codeName = ref(); //编号名称
	const codeId = ref();//编号ID

	const levenList = ref([]) //等级列表
	const levenName = ref(); //等级名称
	const levenId = ref();//等级ID
	codes()
	function codes() {
		const payload = {
			query: getStaffCode,
			variables: {
				status: 9
			},
		};
		toPublish(
			'ql/control/getStaffCode',
			payload,
			(obj : any) => {
				const { getStaffCode } = obj.data;
				codeList.value = getStaffCode
			}
		);
	}
	leven()
	function leven() {
		const payload = {
			query: getStaffLevel,
		};
		toPublish(
			'ql/control/getStaffLevel',
			payload,
			(obj : any) => {
				const { getStaffLevel } = obj.data;
				levenList.value = getStaffLevel
			}
		);
	}
	function consolucode(e : any) {
		showLoading()
		const payload = {
			staff_id: props.id,
			code: e.data.code,
		};
		toPublish(
			'control/setStaffCode',
			payload,
			(obj : any) => {
				const { code, msg } = obj;
				if (code === 1) {
					codeId.value = e.data.id
					codeName.value = e.data.code
					successToast(msg)
				} else {
					errorToast(msg)
				}
			}
		);
	}
	function consoluleve(e : any) {
		const payload = {
			staff_id: props.id,
			level: e.data.name,
		};
		toPublish(
			'control/setStaffLevel',
			payload,
			(obj : any) => {
				const { code, msg } = obj;
				if (code === 1) {
					levenId.value = e.data.id
					levenName.value = e.data.name
					successToast(msg)
				} else {
					errorToast(msg)
				}
			}
		);
	}
</script>

<style scoped lang="less">
	.list {
		flex-wrap: wrap;

		view {
			background-color: #DDE8FC;
			border-radius: 5px;
			padding: 10rpx 30rpx;
			box-sizing: border-box;
			margin: 15rpx;
		}
	}
</style>
<style>
	.package>>>.checklist-box {
		margin-right: 0px;
	}

	.package>>>.uni-data-checklist {
		flex: none;
	}

	.space-between>>>.select-picker {
		justify-content: flex-end;
	}

	.package>>>.mk-upload {
		padding: 0px;
	}
</style>